<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>通知详情</title>

	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<link rel="stylesheet" href="css/main.css">
	<link rel="stylesheet" href="css/school_notice.css">

	<style>
		.tall {
			transform: scale(1, 1.2);
			margin: 0 3px 0 3px;
			color: red;
		}

		.img_box {
			width: 90%;
			height: auto !important;
		}
	</style>

</head>

<body>
	<div id="container" style="height: 100%">
		<div class="contain">
			<div class="header">
				<div class="header_title">通知详情</div>
				<a onclick="history.back()">
					<img src="image/return.png" alt="" class="return">
				</a>
			</div>
		</div>
		<div style="height: 40px;"></div>
		<div class="notice_info header-after" style="height: 100%" id="vue-root">
			<div class="info_header">
				<h3 style="padding-top: 10%;" v-text="notice.title"></h3>
			</div>
			<div class="img_box" v-if="notice.pic">
				<img class="notice_img" :src="getImg(notice.pic)" />
			</div>
			<div class="info_center" v-text="notice.text"></div>
			<div class="info_foot">
				<p v-text="notice.time"></p>
				<p class="department" v-if="!isTeacher" v-text="notice.teacherName"></p>
				<p style="margin-left: 12%;" v-if="isTeacher">
					查阅人数:<a class="tall" v-text="notice.readCount"></a>
					/<a v-text="notice.totalCount"></a>人
				</p>
			</div>
		</div>
	</div>


	<script src="/scriptZIP/qs.min.js"></script>
	<script src="/scriptZIP/vue.min.js"></script>
	<script src="/scriptZIP/axios.min.js"></script>

	<script src="/js/common.js"></script>

	<script>
		var app = new Vue({
			el: '#vue-root',
			data: {
				id: null,
				isTeacher: false,
				notice: {}
			},
			created: function () {
				var id = params().id;

				if (!id) {
					alert('参数错误');
					throw '找不到id';
				};
				this.id = id;

				if (location.hash == '#teacher') this.isTeacher = true;
				var user = this.isTeacher ? getTeacher() : getStudent();
				this.schoolId = user.schoolId;


				if (!this.isTeacher) {
					axios.post('/s/classNotice/read/' + id).then(function (res) {
						console.log('阅');
					});
				}

				this.getData();
			},
			methods: {
				getData: function () {
					var url = this.isTeacher ? '/t/classNotice/' : '/s/classNotice/';
					axios.get(url + this.id).then(function (res) {
						this.notice = res.data;
					}.bind(this));
				},
				getImg: function (pic) {
					return '/static/' + this.schoolId + '/classes_notice/' + pic;
				}
			}
		});

	</script>

</body>

</html>